<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
<%@ taglib uri="/resource/UserPwoer.tld" prefix="p"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
	pageContext.setAttribute("fnId", request.getAttribute("fnId"));
	pageContext.setAttribute("userPwoer", request.getSession().getAttribute("userPwoer"));
%>
<c:set var="path" value="${pageContext.request.contextPath }" />
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport"
	content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<LINK rel="Bookmark" href="../images/favicon.ico">
<!-- 本框架基本脚本和样式 -->
<script type="text/javascript"
	src="${path }/resource/js/jquery-2.1.4.min.js"></script>
<script type="text/javascript"
	src="${path }/resource/js/systools/MBase.js"></script>
<style type="text/css">
.user-head {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    margin-right: 5px;
}
</style>
</head>
<body class="gray-bg">
	<nav class="huiNav">
		<i class="fa fa-home"></i> 首页 <span>&gt;</span>系统管理<span>&gt;</span>项目列表
		<a class="btn btn-info  btn-sm pull-right"
			href="javascript:location.replace(location.href);" title="刷新"><i
			class="fa fa-refresh"></i></a>
	</nav>

	<div class="ibox-content">
	<!-- 搜索框部分start -->
	<p:btn value="serch">
		<form class="form-inline" id="serchform">
		<div class="form-group mr-20">
		<label for="exampleInputName2">项目名称</label> 
		<input name="projName" type="text" class="form-control">
		</div>
		
		<label for="exampleInputName2">项目状态</label>
			<div class="form-group mr-20">
					<div class="col-sm-4 ">
						 <select name="status" class=" select2 form-control autoFull"
								style="width: 200px" 
								data-filed="name"
								data-value="name"
								data-url="${path}/admin/dataDictionary/showDataDictionary"	 
								data-param="{type:'项目状态'}" > 
								<option value="">请选择项目状态</option>
							</select>
						
					</div>
			</div>
			
		<label for="exampleInputName2">创建人</label>
			<div class="form-group mr-20">
					<div class="col-sm-4 ">
						 <select name="userId" class=" select2 form-control autoFull"
								style="width: 200px" 
								data-url="${path}/admin/showAllList" 
								data-filed="name"
								data-value="id">
								<option value="">请选择创建人</option>
							</select>
						
					</div>
			</div>
			<button  onclick="myGrid.serchData()" type="button" class="btn btn-info btn-sm"><i class="fa fa-search " ></i> 搜索</button>
			<button  type="button" onclick="MForm.reset('#serchform');" class="btn btn-info btn-sm"><i class="fa fa-refresh " ></i> 重置</button>
		</form>
		</p:btn>
	<!-- 搜索框部分en -->
		<div class="option-bar" >
		<p:btn value="dels">
			<button onclick="myGrid.delItems()" type="button" class="btn btn-danger btn-sm"><i class="fa fa-trash" ></i>批量删除</button>
		</p:btn>
		<p:btn value="add">
			<button onclick="openAdd()" type="button" class="btn btn-success btn-sm"><i class="fa fa-plus" ></i>  新增</button>
		</p:btn>
		</div>
		<table id="mgrid" class="table table-no-bordered table-striped">
			<thead>
				<tr>
					<th data-checkbox="true"  ></th>
					<th data-formatter="MGrid.indexfn" data-align="center"  data-width="30px" >序号</th>
					<!-- <th data-field="projName" >项目名称</th>
					<th data-field="userName" >创建人</th>
					<th data-field="client.companyName" >客户</th>
					<th data-field="createTime" data-formatter="MGrid.getTimeDD" >创建时间</th>
					<th data-field="beginTime" data-formatter="MGrid.getTimeDD" >开始时间</th>
					<th data-field="endTime" data-formatter="MGrid.getTimeDD"  >预计结束时间</th>
					<th data-field="status" >状态</th> -->
					<th data-field="status" data-formatter="changeStatusStyle">项目状态</th>
					<th data-field="projName" data-formatter="createTitle">项目名称</th>
					<th data-field="projName" data-formatter="createProgress">项目进度</th>
					<th data-field="projUserList" data-formatter="createImg">项目参与者</th>
					<th data-align="center"  data-width="150px" data-field="id" data-formatter="buidOperate">操作</th>
				</tr>
			</thead>
		</table>
	</div>
	
	<script type="text/javascript">
	
	$(".select2").select2();
	var myGrid;
		$(function(){
			MTools.autoFullSelect();
			//有删除权限
			var delUrl="";
			<p:btn value="dels">
			delUrl="${path}/admin/project/del";
			</p:btn>
			
			 myGrid=MGrid.initGrid({
				 url:"${path}/admin/project/showList",
				 delUrl:delUrl
			 });
		});
		function buidOperate(value, row, index){
			var html='';
			<p:btn value="manager">
			html+='<button class="btn btn-default btn-sm mr-5" onClick="manage('+value+')"  title="管理"><i class="fa fa-cogs"></i></buttoun>'
			</p:btn>
			<p:btn value="edit">
			html+='<button class="btn btn-default btn-sm mr-5" onClick="openEdit('+value+')"  title="编辑"><i class="fa fa-edit"></i></buttoun>'
			</p:btn>
			<p:btn value="del">
			html+='<button class="btn btn-default btn-sm" onClick="myGrid.delItem('+value+')" title="删除"><i class="fa fa-lg fa-trash-o"></i></buttoun>';
			</p:btn>
			html+=''
			return html; 
		}
		
		//改变状态样式		
		function changeStatusStyle(value, row, index){
			var html='<div class="project-status"><span class="label label-primary">'+value+'</span></div>';
			return html;
		}
		//创建项目名称
		function createTitle(value, row, index){
			var html= "";
			html +='<div class="text-warning"><h2><strong>'+value+'</strong></h2></div>';
			html +='<div><small>创建时间&nbsp;:&nbsp;'+MTools.farmterTime(row.createTime)+'</small></dib>';
			html +='<div><small>创建人&nbsp;:&nbsp;'+row.userName+'</small></dib>';
			var clientName = "";
			if(row.client != null){
				clientName = row.client.companyName;
			}else{
				clientName = "-";
			}
			html +='<div><small>客户&nbsp;:&nbsp;'+clientName+'</small></dib>';
			return html;
		}
		
		//创建头像
		function createImg(value, row, index){
			var projUserList = value;
			var html = "";
			for(var i = 0;i<projUserList.length;i++){
				var imgUrl = projUserList[i].userPhoto;
				var uname = projUserList[i].userName;
				html +='<img title="'+uname+'" class="user-head" src="'+imgUrl+'">';
			}
			return html;
		}
		
		
		//创建项目名进度
		function createProgress(value, row, index){
			var html= "";
			var createDate = row.createTime;//创建时间			
			var endDate = row.endTime;//预计结束时间
			var nowDate=new Date().getTime();//当前时间	
			var p=((nowDate - createDate)/(endDate - createDate)) *100;
			p = p>100?100:p.toFixed(2);	
			if((endDate - createDate)<0){
				p = 100
			}
			html +='<small>当前开发进度：'+p+'%</small><div class="progress progress-mini">'
                +'<div style="width: '+p+'%" class="progress-bar"></div></div><br>';
            var projId = row.id;    
            var taskNum = row.taskNum;
            var taskFinishNum = row.taskFinishNum;
            var projStatus = 0;
            if(taskNum!=null && taskFinishNum){
            	projStatus = (taskFinishNum / taskNum)* 100;
            }          
            html +='<small>当前任务完成进度：'+projStatus.toFixed(2)+'%</small><div class="progress progress-mini">'
            +'<div style="width: '+projStatus.toFixed(2)+'%" class="progress-bar"></div></div>';
            return html;
		}
		
		//查询任务，不包括已取消的,已删除的
		function queryTaskAll(projId){
			var projTaskAll = 0;
			$.AjaxProxy({
				a : false,
				c : false
			}).invoke(
				"${path}/admin/project/queryAllTask?projId="+projId,
				function(loj) {
					var total = loj.attr("result").total;
					if(total!=null){
						projTaskAll = total;
					}
				});
			return projTaskAll;
		}
		
		//查询完成任务，不包括已取消的,已删除的
		function queryTaskFinishAll(projId){
			var projFinishTaskAll = 0;
			$.AjaxProxy({
				a : false,
				c : false
			}).invoke(
				"${path}/admin/project/queryAllFinishTask?projId="+projId,
				function(loj) {
					var total = loj.attr("result").total;
					if(total!=null){
						projFinishTaskAll = total;
					}
				});
			return projFinishTaskAll;
		}
		
		//打开添加界面
		<p:btn value="add">
		function openAdd() {
			layer.full(
			layer.open({
				type : 2,
				title : "添加项目",
				area : [ MUI.SIZE_L, '400px' ],
				content : [ '${path}/admin/project/editForm']
			})); 
		}
		</p:btn>
		//打开添加界面
		<p:btn value="edit">
		function openEdit(value) {
			layer.full(
			layer.open({
				type : 2,
				title : "添加项目",
				area : [ MUI.SIZE_L, '400px' ],
				content : [ '${path}/admin/project/editForm?id='+value]
			})); 
		}
		</p:btn>
		
		function manage(value){
			/* window.location.href="${path}/admin/projectInfo/all?id="+value; */
			window.location.href="${path}/admin/projectInfo/sonManager?id="+value;
		}
		
	</script>
</body>
</html>
